<template>

  <popup :title="title" @confirm="handleSubmit" ref="popupRef">

    <el-form :model="formData" :rules="rules" ref="formRef" label-width="10%">

      <el-form-item label="密码" prop="password">
        <el-input
            class="ls-input"
            v-model="formData.password"
            placeholder="请输入密码"
            clearable
        />
      </el-form-item>

    </el-form>

  </popup>

</template>

<script setup>
import popup from '@/components/popup/index.vue'
import {reactive, ref, shallowRef} from "vue";
import {resetUserPassword} from '@/api/user'
import FormInstance from 'element-plus'

const formRef = shallowRef(FormInstance)
const popupRef = shallowRef(popup)
const emit = defineEmits(['success'])

const title = ref('重置用户密码')
const formData = reactive({
  user_id: 0,
  password: '',
})

const rules = reactive({
  password: [
    {required: true, message: '请输入密码', trigger: 'blur'},
    {min: 3, message: '长度必须大于3', trigger: 'blur'},
  ],
})

const handleSubmit = async () => {
  await formRef.value?.validate()
  await resetUserPassword(formData)
  emit('success')
}

const setFormData = async (row) => {
  formData["user_id"] = row.id
  title.value = '重置【' + row.account + '】用户密码'
}

defineExpose({
  setFormData
})
</script>

<style scoped>

</style>